<template>
	<view class="m-tap">
		<view class="m-t-item" v-for="(item,index) in list" :key=index @tap="handleGoPage(item)">
			<view v-if="item.id===4">
				<button class="contact" open-type="contact">
					<image :src="item.img_url"></image>
					<view class="i-title-button">{{item.title}}</view>
				</button>
			</view>
			<view v-else>
				<image :src="item.img_url"></image>
				<view class="i-title">{{item.title}}</view>
			</view>

		</view>
	</view>
</template>

<script>
	export default {
		name: "m-tap",
		props: {
			list: {
				type: Array
			}
		},
		data() {
			return {}
		},
		methods: {
			handleGoPage(item) {
				let _self=this
              if(item.title==="关于我们"){
				  _self.$router.push({
					  route:_self.$routesConfig.aboutUs
				  })
			  }else if(item.title==="行业资讯"){
				  _self.$router.push({
					  route:_self.$routesConfig.industry
				  })
			  }else if(item.title==="新手帮助"){
				  _self.$router.push({
					  route:_self.$routesConfig.noviceHelp
				  })
			  }
			}
		}

	}
</script>

<style scoped lang="less">
	.m-tap {
		width: 100%;
		display: flex;
		justify-content: space-between;
		padding: 50rpx 50rpx;
		box-sizing: border-box;

		.m-t-item {
			display: flex;
			flex-direction: column;
			align-items: center;

			image {
				display: block;
				width: 73rpx;
				height: 64rpx;
			}

			.i-title {
				color: #333333;
				font-size: 20rpx;
				padding-top: 20rpx;
			}
		}
	}
	.contact{
		text-align: center;
		font-size: 24rpx;
		color: #FF9502;
		background-color:#FFFFFF ;
		padding: 0 !important;
		padding-top: 5rpx !important;
		line-height: 1.5
	}
	.contact::after{
		border: none !important;
	}
	.i-title-button{
		padding-top: 18rpx;
		color: #333333;
		font-size: 20rpx;
	}
</style>
